<!DOCTYPE html>
<html>

<head>
    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'>
    <title> p2p broadcast demo </title>
    <style type="text/css">
        .room {
            cursor: pointer;
        }

        div.select {
            display: inline-block;
            margin: 0 0 1em 0;
        }
    </style>

    <script src="https://cdn.bootcss.com/socket.io/2.2.0/socket.io.js"></script>
    <script src="/eventEmit.js"></script>
    <script src="/simplepeer.min.js"></script>
    <script src="/cbor.js"></script>  
    {{!-- <script src="/ipfs-core-index.min.js"></script> --}}
    <script src="/av-manager-bundle.js"></script>
    {{!-- <script type='text/javascript'>  </script> --}}

</head>

<body>
    <h1>p2p broadcast demo</h1>
    <br />

  昵称: <span id="userName"></span> <br/>
  房间: <span id="roomId">{{roomID}}</span> <br/>

    <div>
        <button id="publish-button">Publish</button>
        <br><br>
        <button id="play-button">Play</button>
    </div>


    <div id="conference">
        publish:
        <br/>
        <h4 id="audio_count">0</h4>        
        <br />
        <div id="container">
            <video id="video_container_publish" playsinline controls autoplay muted width="640" height="480"></video>
        </div>
        <br />

    </div>


    <div id="conference">
        play:
        <br/>
        <audio controls autoplay></audio>        
        <br />
        <div id="container">            
            <video id="video_container_play" playsinline controls autoplay muted width="640" height="480"></video>
        </div>
        <br />
    </div>
</body>
</html>